<template>
 <div>
  <table>
   <MySell v-for="(item, index) in goodsArr" :key="index" :obj="item" @add="item.count = $event - 0"></MySell>
  </table>
  <p>ALL Number:{{ allNumber }}</p >
 </div>
</template>

<script>
import MySell from '@/components/MySell'
export default {
 data() {
  return {
   goodsArr: [
    {
     count: 0,
     goodsName: 'Watermelon'
    },
    {
     count: 0,
     goodsName: 'Banana'
    },
    {
     count: 0,
     goodsName: 'Orange'
    },
    {
     count: 0,
     goodsName: 'Pineapple'
    },
    {
     count: 0,
     goodsName: 'Strawberry'
    }
   ]
  }
 },
 methods: {},
 components: { MySell },
 computed: {
  allNumber() {
   return this.goodsArr.reduce((prev, item) => prev + item.count, 0)
  }
 },
 watch: {},
 created() {},
 props: {}
}
</script>

<style scoped></style>
